<template>
    <div class="login">
        <h2>欢迎来到登录</h2>
        <div class="box">
            <input type="text" name="username" placeholder="用户名">
        </div>
        <div class="box">
            <input type="text" name="account" placeholder="账号">
        </div>
        <div class="box">
            <input type="password" name="password" placeholder="密码">
        </div>
        <button @click="changeurl">登录</button>
    </div>
</template>

<script>
export default {
    
    methods: {
        changeurl() {
            this.$store.commit('changestate', 1)
            if (this.$store.state.loginstate == 1) {
                this.$router.push('/index')
            }
        },
    }
}
</script>

<style scoped lang="scss">
.login {
    h2 {
        text-align: center;
    }

    .box {
        width: 250px;
        margin: 40px auto;

        input {
            width: 250px;
            height: 40px;
            border-radius: 20px;
            border: 1px solid black;
            outline: 0;
            text-align: center;
            font-size: 20px;
        }
    }

    button {
        display: block;
        width: 250px;
        height: 40px;
        border-radius: 20px;
        margin: auto;
        font-size: 30px;
    }
}
</style>